<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>打卡</title>
    <style>
        #app{
            background-color: #d0d5d8;
        }
    </style>
</head>
<body>

<div id="app" style="padding: 50px">
    <label>日志</label>
    <br>
    <textarea name="todayLog" cols="80" rows="20">这个人什么也没留下</textarea>
    <br>
    <button @click="doPunch">打卡</button>

</div>


<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/vue.min.js"></script>
<script type="text/javascript">
    new Vue({
        el:"#app",
        methods:{
            doPunch:function (e) {
                let  that=this
                $.ajax({
                    url:"/card/punch_card",
                    type:"POST",
                    data:{
                        todayLog:$("textarea[name=todayLog]").val()
                    },
                    success:function (result) {
                        if(result.code==561){
                            alert("今日已打卡")
                        }
                        else if(result.code==554){
                            alert("打卡出错")
                        }else if(result.code==564){
                            alert("请先完成学习任务")
                        }else{
                            alert("打卡成功")
                        }
                    }
                })
            }
        }
    })
</script>
</body>
</html>